<template>
  <a-modal width="1015px" :visible="SAVisible" cancelText="关闭" @cancel="SAVisiblehandleCancel">
    <a-row v-if="editShow != 'edit'">
      <a-col :span="9">
        <a-row>
          <a-col :span="3" style="line-height: 30px"> 卡号： </a-col>
          <a-col :span="21">
            <a-input-search
              v-model="SASearchValue"
              placeholder="请输入要预约的顾客卡号"
              allowClear
              style="width: 300px"
              :class="SANoCardShow && 'no-user-input-style'"
              enter-button
              @search="SAonSearch"
              :loading="searchLoading"
              @click="inputClick"
            />
          </a-col>
        </a-row>
      </a-col>
    </a-row>

    <div v-if="SABoxShow">
      <div class="SA-box">
        <!-- <a-row>
          <a-col :span="4"> 顾客姓名：{{ searchUserinfo.name }} </a-col>
          <a-col :span="5"> 顾客卡号：{{ searchUserinfo.cardNo }} </a-col>

          <a-col :span="4"> 顾客年龄：{{ searchUserinfo.age }} 岁 </a-col>
          <a-col :span="4"> 顾客性别：{{ searchUserinfo.sex === 0 ? '男' : '女' }} </a-col>
          <a-col :span="4"> 所属客管：{{ searchUserinfo.consultManName }} </a-col>
        </a-row>
        <a-row class="SA-box">
          <a-col :md="4"> 开单客管：{{ searchUserinfo.developerName }} </a-col>
     

          <a-col :md="18" style="display:flex"> <span style="width:80px;display:bloc">联系方式：</span><span style="width:calc(100% - 80px);display:block">{{ searchUserinfo.tel }}</span></a-col>
        </a-row> -->
        <a-row class="SA-box">
          <a-col :span="6"> 顾客姓名：{{ searchUserinfo.name }} </a-col>
          <a-col :span="6"> 顾客卡号：{{ searchUserinfo.cardNo }} </a-col>

          <a-col :span="6"> 顾客年龄：{{ searchUserinfo.age?searchUserinfo.age + '岁':'未知' }} </a-col>
          <a-col :span="6"> 顾客性别：{{ searchUserinfo.sex === 0 ? '男' : '女' }} </a-col>
   
        </a-row>
        <a-row class="SA-box"> 
          <a-col :span="6"> 所属客管：{{ searchUserinfo.consultManName }} </a-col>
          <a-col :md="6"> 开单客管：{{ searchUserinfo.developerName }} </a-col> 
          <a-col :md="12" style="display:flex"> <span style="width：70px;display:bloc">联系方式：</span><span style="width:calc(100% - 70px);display:block">{{ searchUserinfo.tel }}</span></a-col>
        </a-row>
      </div>
      <a-form :form="formData" layout="inline" :selfUpdate="true">
        <a-row class="SA-box">
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="预约专家">
              <a-cascader
                :show-search="{ filter }"
                style="width: 195.5px"
                :field-names="{ label: 'name', value: 'id', children: 'deptList' }"
                :options="selectDeptDataAll"
                placeholder="请先选择预约专家" 
                @change="(value, option) => ExpertChange(value, option, 'appointmentExpertName')"
                v-decorator="['appointmentExpert', { rules: [{ required: true, message: '请先选择预约专家' }] }]"
              />
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="其他专家">
              <a-cascader
                :show-search="{ filter }"
                style="width: 195.5px"
                :field-names="{ label: 'name', value: 'id', children: 'deptList' }"
                :options="selectDeptDataAll"
                placeholder="请先选择其他专家" 
                @change="(value, option) => ExpertChange(value, option, 'otherExpertName')"
                v-decorator="['otherExpert', { rules: [{ required: false, message: '请先选择其他专家' }] }]"
              />
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="医生助理">
              <a-cascader
                :show-search="{ filter }"
                style="width: 195.5px"
                :field-names="{ label: 'name', value: 'id', children: 'assistantList' }"
                :options="selectDeptDataAll"
                placeholder="请先选择医助" 
                @change="(value, option) => ExpertChange(value, option, 'doctorAssistantExpertName')"
                v-decorator="['doctorAssistant', { rules: [{ required: false, message: '请先选择医助' }] }]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row class="SA-box">
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="配台护士">
              <a-cascader
                :show-search="{ filter }"
                style="width: 195.5px"
                :field-names="{ label: 'name', value: 'id', children: 'nurseList' }"
                :options="selectDeptDataAll"
                placeholder="请先选择配台护士" 
                @change="(value, option) => ExpertChange(value, option, 'deskNurseExpertName')"
                v-decorator="['deskNurse', { rules: [{ required: false, message: '请先选择配台护士' }] }]"
              />
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="美容仪器"> 
              <a-select
                style="width: 195.5px"
                labelInValue
                v-decorator="['beautyEquipment', { rules: [{ required: false, message: '请先选择仪器' }] }]"
              >
                <a-select-option  :value="item.tgbArmariumId" v-for="(item) in armariumListData" :key="item.equipmentName"> {{item.equipmentName}} 
                </a-select-option> 

              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="咨询类型">
              <a-select
                style="width: 195.5px"
                v-decorator="['consultationType', { rules: [{ required: true, message: '请先选择咨询类型' }] }]"
              >
                <a-select-option value="09011301"> 初诊 </a-select-option>
                <a-select-option value="09011302"> 复诊 </a-select-option>
                <a-select-option value="09011303"> 再消费 </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>

        <a-row class="SA-box">
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="预约日期">
              <a-date-picker
                allow-clear
                style="width: 195.5px"
                :disabledDate="disabledDate"
                :showToday="false"
                @change="dateChange"
                v-decorator="['appointmentDate', { rules: [{ required: true, message: '请选择手术日期' }] }]"
              />
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="预约时间"> 
              <a-range-picker   
                class="timeRemove"
                allow-clear
                style="width: 195.5px"
                :show-time="{ format: 'HH:mm',hideDisabledOptions:true }"
                format="HH:mm"
                :mode="['time', 'time']"
                :placeholder="['开始', '结束']"
                @calendarChange="TimeChange"
                :disabledTime="disabledDateTime"
                @ok="appointmentTimeOk"
                @openChange="timeOpenChange"
                v-decorator="['appointmentTime', { rules: [{ required: true, message: '请选择开始时间' }] }]" 
              />
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA input-style">
            <a-form-item label="预计时长">
              <a-input style="width: 195.5px; text-align: right" v-model="treatmentDuration" disabled suffix="分钟" />
            </a-form-item>
          </a-col>
        </a-row>

        <a-row class="SA-box">
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="麻醉类型">
              <a-select
                style="width: 195.5px"
                v-decorator="['anesthesiaType', { rules: [{ required: true, message: '请先选择麻醉类型' }] }]"
              >
                <a-select-option value="1"> 局麻 </a-select-option>
                <a-select-option value="2"> 全麻 </a-select-option>
                <a-select-option value="3"> 表麻 </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="检查结果">
              <a-select
                style="width: 195.5px"
                v-decorator="['inspectionResults', { rules: [{ required: true, message: '请先选择检查结果' }] }]"
              >
                <a-select-option value="1"> 已检 </a-select-option>
                <a-select-option value="0"> 未检 </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="8" class="select-style-SA">
            <a-form-item label="费用情况">
              <a-select
                style="width: 195.5px"
                v-decorator="['costSituation', { rules: [{ required: true, message: '请先选择费用情况' }] }]"
              >
                <a-select-option value="1"> 已交 </a-select-option>
                <a-select-option value="0"> 未交 </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row class="SA-box">
          <a-col :md="15">
            <a-form-item label="备注" class="text-area-style">
              <a-textarea
                placeholder="请输入备注信息"
                :auto-size="{ minRows: 3, maxRows: 5 }"
                v-decorator="['remarks', { rules: [{ required: false, message: '请输入备注信息' }] }]"
              />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>

      <!-- 项目表格 -->
      <div style="margin-top: 50px" >
        <a-table
          :columns="innerColumns"
          :data-source="itemList"
          :rowKey="(record, index) => index"
          :pagination="false"
          :bordered="false" 
          :loading="tableLoading"
          :rowClassName="setRowClassName"
        >
          <!--本次预约次数-->
          <template slot="tqty" slot-scope="text,record,index">
            <a-input-number 
              :min="0"
              :step="1" 
              :value="text"
              :max="Number(record.residueQty)"
              @change="(value) => valChange(value, record, index, 'tqty')"
              style="width: 100px"
              placeholder="次数"  
              :precision="0"
            ></a-input-number> 
          </template>
          <!--耗材名称-->
          <template slot="consumableName" slot-scope="text,record,index">
            <a-input 
              allowClear
              :value="text" 
              @change="(value) => valChange(value, record, index, 'consumableName')"
              style="width: 100px"
              placeholder="耗材"   
            ></a-input> 
          </template>
          <!--耗材数量-->
          <template slot="numberConsumable" slot-scope="text,record,index">
            <a-input-number 
              allowClear
              :min="0"
              :step="1" 
              :value="text" 
              @change="(value) => valChange(value, record, index, 'numberConsumable')"
              style="width: 100px"
              placeholder="次数"  
              :precision="0"
            ></a-input-number> 
          </template> 
        </a-table>
      </div>
    </div>

    <div v-if="SANoCardShow" :class="SANoCardShow && 'no-user-style'">暂无该用户，请重新输入卡号</div>

    <template slot="footer">
      <a-button @click="SAVisiblehandleCancel()">关闭</a-button>
      <a-button type="primary" @click="SASubmit()" :disabled="!SABoxShow">确认</a-button>
    </template>
  </a-modal>
</template>
<script>
import {
  SelectCardNo,
  SelectDeptNameAll, 
  EditManualSchedule,
  SelectOperationScheduler,
  ManualSchedule
} from '@/api/modular/main/bookingManagement/bookingManagement'
import moment from 'moment'
export default {
  props: {
    row_record: {
      type: Object,
      default: () => {
        {
        }
      },
    },
  },
  data() {
    return {
      // 手术预约
      SAVisible: false,
      SABoxShow: false,
      SANoCardShow: false,
      searchLoading: false,
      SASearchValue: '',
      timeType: 'date', 
      // 下拉数据
      selectDeptDataAll:[],

      searchUserinfo: {},
      formData: this.$form.createForm(this),
      editShow: '',

      // 项目表格
      pagination: {
        pageNum: 1,
        pageSize: 20,
        current: 1,
        total: 20,
      },
      itemList: [],
      tableLoading: false,
      innerColumns: [
        {
          title: '项目名称',
          align: 'center',
          dataIndex: 'name', 
          width: 220,
          ellipsis: true,
        },
        { title: '总次数', align: 'center', dataIndex: 'qty', width: 120, ellipsis: true },
        { title: '已做次数', align: 'center', dataIndex: 'rqty', width: 120, ellipsis: true },
        { title: '剩余次数', align: 'center', dataIndex: 'residueQty', width: 120, ellipsis: true },
        { 
          title: '本次预约次数', 
          align: 'center', 
          dataIndex: 'tqty', 
          width: 120,  
          scopedSlots: { customRender: 'tqty' },
        },
        { title: '耗材名称', align: 'center', dataIndex: 'consumableName', width: 120, scopedSlots: { customRender: 'consumableName' }, },
        {
          title: '耗材数量',
          align: 'center', 
          dataIndex: 'numberConsumable',
          width: 120,
          scopedSlots: { customRender: 'numberConsumable' },
        },
      ],

      // 预约时间
      treatmentDuration: 0,
      // 预约医生的id
      appointmentExpertName: '',
      // 其他医生的id
      otherExpertName: '',
      // 医生助理
      doctorAssistantExpertName:'',
      // 配台护士
      deskNurseExpertName: '',
      armariumListData:[],

      dateT: moment(new Date).format('YYYY-MM-DD'),
      houseT: moment(new Date).format('HH'),
      minT: moment(new Date).format('mm'), 


    }
  },
 
  created(){
     
  },
  methods: {
    // 搜索
    filter(inputValue, path) { 
      return path.some(option => option.name.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
    },
    // 预约医生的下拉
    ExpertChange(value, selectedOptions,name){ 
      if(selectedOptions){
        this[`${name}`] = selectedOptions[1].name
      }else{
        this[`${name}`] = ''
      }
    },
    setRowClassName (record) {
      if (record.tqty > 0) {
        return 'rowcolor'
      }  
    },
    // change事件赋值
    valChange(value, record, index, t) { 
      console.log(value)  
      if(t == 'consumableName'){ 
        this.itemList[index][`${t}`] = value.target.value
      }else{
        this.itemList[index][`${t}`] = (value == null ? 0 : value)
      }
      
      this.itemList = [...this.itemList]
    },
     
    // 选择预约时间的click
    appointmentTimeOk(value) {
      let startTime = new Date(moment(value[0]).format('YYYY-MM-DD HH:mm:ss')).getTime()
      let endTime = new Date(moment(value[1]).format('YYYY-MM-DD HH:mm:ss')).getTime()
      this.treatmentDuration = new Date(Number(endTime) - Number(startTime)) / (1000 * 60)
    },
    moment,
    // 禁用
    disabledDate(current) {
      return current && current < moment().startOf('day');  //当天之前的不可选，不包括当天
      
    }, 
    dateChange(monent, day) {
      
      this.formData.setFieldsValue({ 
        appointmentTime: []
      })
      console.log(monent, day) 
      let thisTime = moment(new Date).format('YYYY-MM-DD')
      this.dateT = day
      
      if(Number(day.replace(/\-/g,'')) <= Number(thisTime.replace(/\-/g,''))){
        this.houseT = moment(new Date).format('HH')
        this.minT = moment(new Date).format('mm')   
      }else{
        this.houseT = 0
        this.minT = 0  
      }
    },
    
    timeOpenChange(status){ 
      setTimeout(() => { 
        if(status){
          document.querySelectorAll('.ant-calendar-time-picker-btn')[0].style.display = 'none' 
          document.querySelectorAll('.ant-calendar-time-picker-column-2')[0].style['background-color'] = '#fff' 
          document.querySelectorAll('.ant-calendar-time-picker-column-2')[1].style['background-color'] = '#fff'  
          document.querySelectorAll('.ant-calendar-time-picker-inner')[0].style['padding-top'] = '0'  
          document.querySelectorAll('.ant-calendar-time-picker-inner')[1].style['padding-top'] = '0' 
        }  
      }, 100);
      
      
    },
    // 限制时间
    TimeChange(monent, day){ 
      
      
      let clickHouseT = Number(moment(monent[0]).format('HH'))   

      if(this.dateT == moment(new Date).format('YYYY-MM-DD')){
        if(clickHouseT == Number(moment(new Date).format('HH'))){ 
          this.minT = moment(new Date).format('mm') 
        }else{ 
          this.minT = 0
        }
      }else{
        this.minT = 0
      } 
      
    }, 
    range(start, end) {
      const result = [];
      for (let i = start; i < end; i++) {
        result.push(i);
      }
      return result;
    }, 
    disabledDateTime(type, partial) {  
      if (partial === 'start') { 
        return {
          disabledHours: () => this.range(0, 24).splice(0, Number(this.houseT)),
          disabledMinutes: () => this.range(0, Number(this.minT)), 
        };
      }
      return {
         
      };
      
    },
    // 限制时间
    
     
    SAVisiblehandleCancel() {
      this.SAVisible = false
      this.SASearchValue = ''
      this.searchLoading = false
      this.formData.resetFields()
      setTimeout(() => {
        this.SABoxShow = false
        
      }, 500)
    },
    show(type = '') {
      this.editShow = type
      this.SAVisible = true 
      if (this.editShow == 'edit') {
        this.SABoxShow = true
        this.tableLoading = true

        console.log(this.row_record)
        // 修改的时候调用请求
        let sendData = {
          id: this.row_record.tbSchedulerId,
        }
        SelectOperationScheduler(sendData).then((res) => {
          if (res.code == 200) {
            let data = res.rows[0]
            this.searchUserinfo = data 
            
            this.$nextTick(() => { 
              setTimeout(() => {
                this.tableLoading = false
                this.formData.setFieldsValue({ 
                  appointmentExpert: [data.createdUserDeptId, data.expertId], // 预约专家
                  otherExpert: [data.otherPersonDeptId, data.otherPersonId], // 其他专家
                  doctorAssistant: [data.assistantDeptId, data.assistantId], // 医生助理
                  deskNurse: [data.nuresDeptId, data.nurseId], // 护士
                  beautyEquipment: {
                    key:data.instrumentId,
                    label: data.devices
                  }, // 仪器 
                  
                  consultationType: data.consultTypeName, // 咨询类型
                  anesthesiaType:data.hocusType, // 麻醉类型
                  inspectionResults: data.isCheck, // 检查结果
                  costSituation: data.isMoney, // 缴费情况 
                  remarks: data.memo,
                  appointmentDate: data.schDate, // 预约日期
                  appointmentTime: [data.beginTime, data.endTime]
                }) 
                let startTime = new Date(moment(data.beginTime).format('YYYY-MM-DD HH:mm:ss')).getTime()
                let endTime = new Date(moment(data.endTime).format('YYYY-MM-DD HH:mm:ss')).getTime()
                this.treatmentDuration = Math.round(new Date(Number(endTime) - Number(startTime)) / (1000 * 60)) // 時長
                // 治疗专家
                this.appointmentExpertName = data.experName
                // 其他专家
                this.otherExpertName = data.otherPersonName
                // 医生助理
                this.doctorAssistantExpertName = data.assistantName
                // 护士
                this.deskNurseExpertName = data.nurseName

                let newData = data.detailList.map(item => {
                  return {
                    name: item.treatmentName,
                    qty: item.qty,
                    rqty: item.rqty,
                    residueQty: item.residueQty,
                    tqty: Number(item.treatmentTimes),
                    consumableName: item.productNames,
                    numberConsumable: item.productDoses,
                    tbSchedulerReportId: item.reportId,
                    tbConsultItemId: item.tbConsultItemId
                  }
                })
                let newData2 = data.itemList.map(item =>{
                  return {
                    name: item.name,
                    qty: item.qty,
                    rqty: item.rqty,
                    residueQty: item.residueQty,
                    tqty: 0,
                    consumableName: '',
                    numberConsumable: 0,
                    tbConsultItemId: item.tbConsultItemId 
                  }
                })
                this.itemList = [...newData,...newData2]
                
              },1000)
            })
           
          } else {
            this.$message.error(result.msg)
          }
        })
      }
      
      // 医生下拉
      SelectDeptNameAll().then((result) => {
        if (result.code == 200) {
          let newData = result.rows.map((item) => {
            return {
              name: item.deptName,
              id: item.execDeptId,
              deptList: item.deptList.map((elemt) => {
                return {
                  name: elemt.userName,
                  id: elemt.erpId,
                }
              }),
              assistantList: item.assistantList.map((elemt) => {
                return {
                  name: elemt.userName,
                  id: elemt.erpId,
                }
              }), 
              nurseList: item.nurseList.map((elemt) => {
                return {
                  name: elemt.userName,
                  id: elemt.erpId,
                }
              }), 
 
            }
          })
          this.armariumListData = result.rows[0].armariumList
          // 美容仪器
          console.log(newData)
          this.$nextTick(() => {
            this.selectDeptDataAll = newData
          })
        } else {
          this.$message.error(result.msg)
        }
      })


      
    },
    // 到院预约 -- 新增 点击日期选择器
    handleOpenChange(open) {
      console.log(open)
      if (open) {
        this.timeType = 'date'
      }
    },
    inputClick() {
      this.SANoCardShow = false
    },
    // 选择类型
    handlePanelChange(value, mode) {
      this.timeType = mode
    },
     
    // 点击确认
    SASubmit() {
      let _that = this
      console.log('确认')
      const {
        formData: { validateFields },
      } = this
      validateFields((errors, values) => {
        if (errors) {
          console.log('表单检验未通过111', errors, values)
          return
        }
        const form_values = this.formData.getFieldsValue() 
        console.log(form_values)
        
        // 过滤出选了数量的项目 进行开单
        let newItemData = this.itemList.filter(item => {
          return item.tqty > 0
        })
        console.log(newItemData)  
         
        if(newItemData.length > 0){
          
          this.$confirm({
            width:'1015px',
            title: '是否确认预约',
            content: 
              <a-descriptions 
                title="预约信息确认"
                bordered  
              > 
                <a-descriptions-item label="顾客姓名" >
                  {this.searchUserinfo.name}
                </a-descriptions-item>
                <a-descriptions-item label="顾客卡号">
                  {this.searchUserinfo.cardNo}
                </a-descriptions-item>
                <a-descriptions-item label="咨询类型">
                  {form_values.consultationType == '1'?'初诊':(form_values.consultationType == '2'?'复诊':'再消费')}
                </a-descriptions-item>
                <a-descriptions-item label="所属客管">
                 {this.searchUserinfo.developerName}
                </a-descriptions-item>
                <a-descriptions-item label="顾客手机号">
                  {this.searchUserinfo.tel}
                </a-descriptions-item>
                <a-descriptions-item label="预约时间">
                  {moment(form_values.appointmentDate).format('YYYY-MM-DD')}  {moment(form_values.appointmentTime[0]).format('HH:mm')} ~ {moment(form_values.appointmentTime[1]).format('HH:mm')}
                </a-descriptions-item>
                <a-descriptions-item label="预约项目">

                  {newItemData.map(item => {
                    return <p>项目名称：{item.name?item.name:'-'} <span style="margin-left: 30px">项目次数：{item.tqty}</span></p>
                  })}
                  
                </a-descriptions-item>
              </a-descriptions> 
            ,
            okText: '确认',
            cancelText: '取消',
            onOk() { 
              if(_that.editShow == 'edit'){
                _that.itemList = _that.itemList.map(item => {
                  return {
                    productName: item.consumableName, // ---
                    name: item.name,
                    productDoes: item.numberConsumable, // ---
                    qty: item.qty,
                    residueQty: item.residueQty,
                    rqty: item.rqty,
                    tbSchedulerReportId: item.tbSchedulerReportId,
                    tqty: item.tqty, // ---
                    tbConsultItemId: item.tbConsultItemId
                  }
                })
              }
             
              
               console.log(_that.searchUserinfo)
               console.log(form_values.beautyEquipment) 
              let dateTime = moment(form_values.appointmentDate).format('YYYY-MM-DD') 
              let sendData = {
                customerCrmId: _that.searchUserinfo.tbCustomerId, // 客户id
                cardNo: _that.searchUserinfo.cardNo,
                customerName: _that.searchUserinfo.name,
                hoCusSel: form_values.anesthesiaType,  // 麻醉类型
                isMoney: form_values.costSituation, // 缴费情况
                isCheck: form_values.inspectionResults, // 检查情况
                memo: form_values.remarks, // 备注
                consultTypeName: form_values.consultationType, // 咨询类型
                manualSchTime: _that.treatmentDuration, // 预估时长
                scheduleDate: dateTime, // 预约日期
                beginTime: `${dateTime} ${moment(form_values.appointmentTime[0]).format('HH:mm:ss')}`,
                endTime: `${dateTime} ${moment(form_values.appointmentTime[1]).format('HH:mm:ss')}`,
                manualScheduleList: _that.itemList,
                // 预约专家
                expertId: form_values.appointmentExpert[1], 
                expertName: _that.appointmentExpertName,
                // 其他医生
                expertId2: (form_values.otherExpert ? form_values.otherExpert[1] : ''), 
                expertName2: _that.otherExpertName,
                // 医生助理
                expertAssistantSelId: (form_values.doctorAssistant ? form_values.doctorAssistant[1] : ''), 
                expertAssistantSel: _that.doctorAssistantExpertName,
                // 配台护士
                nurseSelIds: (form_values.deskNurse ? form_values.deskNurse[1] : ''),
                nurseSel: _that.deskNurseExpertName,

                deptId: form_values.appointmentExpert[0], 
                instrumentId: (form_values.beautyEquipment ? form_values.beautyEquipment.key : ''), //仪器id 
                devices: (form_values.beautyEquipment ? form_values.beautyEquipment.label : ''), // 仪器名称 
                zxName: _that.searchUserinfo.developerName, // 所属客管
                id: _that.editShow == 'edit' ? _that.searchUserinfo.id : ''

                // // 预约医生的id
                // appointmentExpertName: '',
                // // 其他医生的id
                // otherExpertName: '',
                // // 医生助理
                // doctorAssistantExpertName:'',
                // // 配台护士 
                // deskNurseExpertName: ''
                
              }
              console.log(sendData)
              if(_that.editShow == 'edit'){
                EditManualSchedule(sendData).then(result => {
                  if(result.code === 200){
                    _that.$parent.$refs.table.loadData()
                    _that.$message.success(result.message)
                    _that.SAVisiblehandleCancel()
                  }else{
                    _that.$message.error(result.message)
                  } 
                })
              }else{
                ManualSchedule(sendData).then(result => {
                  if(result.code === 200){
                    _that.$parent.$refs.table.loadData()
                    _that.$message.success(result.message)
                    _that.SAVisiblehandleCancel()
                  }else{
                    _that.$message.error(result.message)
                  } 
                })
              }
               
            },
            onCancel() {
              console.log('Cancel');
            },
          });
        }else{
          this.$message.warning('请先选择需要预约治疗的项目')
        }

      })
    },

    // 点击查询
    SAonSearch(value) {
      console.log(value.replace(/\s*/g, ''))
      if (this.SASearchValue == '') {
        this.$message.warning('请先输入需要检索的卡号')
        return false
      }

      this.searchLoading = true
      this.tableLoading = true
      let sendData = {
        cardNo: this.SASearchValue.replace(/\s*/g, ''),
        type: 1,
      }
      
      SelectCardNo(sendData).then((res) => {
        if (res.code === 200) {
          this.searchLoading = false

          if (res.rows.length > 0) {
            this.SABoxShow = true
            this.SANoCardShow = false
            this.searchUserinfo = res.rows[0]
            
          
            // 项目数组
            res.rows[0].itemList.map(item => {
              item.tqty = 0 
            }) 
            
            this.$nextTick(() => {
              this.tableLoading = false
              this.itemList = res.rows[0].itemList

              this.formData.setFieldsValue({
                'anesthesiaType': '1',
                'inspectionResults': '1',
                'costSituation':'1'

              })
            })
          } else {
            this.SANoCardShow = true
            this.SASearchValue = ''
          } 
         
        } else {
          this.$message.warning(res.msg)
        }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.SA-box {
  margin: 20px 0;
  .select-style-SA {
    height: 40px;
  }
}
/deep/.SA-model-style .ant-modal-wrap {
  top: 20vh !important;
}
/deep/ .no-user-input-style {
  input {
    border-color: red !important;
  }
}
.no-user-style {
  text-align: left;
  color: red;
  position: absolute;
  top: 29px;
  margin: 0 auto;
  left: 8%;
  background-color: #fff;
  width: 235px;
  z-index: 10;
  pointer-events: none;
}
/deep/ .text-area-style {
  width: 100%;
  .ant-form-item-control-wrapper {
    width: 75% !important;
  }
}
/deep/ .has-error .ant-form-explain,
.has-error .ant-form-split {
  color: #f5222d;
  position: absolute;
  top: 12px;
  left: 13px;
  background-color: #fff;
  width: 150px;
  pointer-events: none;
}

/deep/ .ant-calendar-time-picker-btn {
  display: none !important;
}
/deep/ .ant-form-inline .ant-form-item > .ant-form-item-label {
  width: 80px !important;
}
/deep/ .ant-form-inline .ant-form-item > .ant-form-item-control-wrapper {
  width: calc(100% - 80px) !important;
}
/deep/ .input-style {
  .ant-input-affix-wrapper .ant-input:not(:last-child) {
    padding-right: 46px !important;
  }
}
/deep/ .colorBorder {
  border-color: red !important;
}
 
/deep/ .ant-table-thead > tr > th{
  padding: 10px 16px !important;
} 
/deep/ .ant-table-tbody > tr > td{
  padding: 8px 16px !important;
}

// 选中高亮
/deep/ .rowcolor,
/deep/ .rowcolor:hover,
/deep/ .rowcolor>td:hover,
/deep/ .rowcolor>td{
  background-color: #4e84a3 !important;
  color: #fff !important;
}
/deep/ .descript-confrim-style{
  /deep/ .ant-modal{
    width: 800px !important;
  }
}
// /deep/ .ant-modal-body{
//     min-height: 20vh !important;
// }

 
/deep/ .ant-calendar-range.ant-calendar-time .ant-calendar-footer .ant-calendar-time-picker-btn{
  display: none !important;
}
 
</style>